$(function () {

    let w_page_num = 1;
    
    getContent_ajax()
    // 初始化富文本框
    UE.getEditor('editor', {
        initialFrameWidth: "100%" //初始化选项
    })
    UE.getEditor('editor_modify')

    // 获取帖子数据
    function getContent_ajax() {
        $.ajax({
            type: 'GET',
            url: 'http://localhost:7300/mock/5ee7242cb1a45736b4181f4a/dog/content?name=鱼蛋',
            success: function (msg) {
                getContent(msg.data)
            },
            error: function (error) {
                console.log(error.responseText);
            }
        })
    }

    //处理装载帖子
    let c_list_w;//全局
    let c_list_top = [];//置顶帖子
    
    function getContent(data, top = 0) {
        c_list_w = data;
        getContent_place(c_list_w, top)

    }
    $('#content_page li button').click(function () {
        // $(this).text()
        getContent_place_top(c_list_top,$(this).text());
        getContent_place(c_list_w,1,$(this).text())
    })
    let x=0
    //帖子装载位置
    function getContent_place(data, top = 0, page_num = 1) {
        let c_table = $('#c_table')
        if (top == 0) {
            c_table.html("")
        }
        if(page_num*10-c_list_top.length<=10){
            x=0
        }else{
            x=(page_num-1)*10-c_list_top.length
        }
        if(c_list_top.length-page_num*10<0){
            
            for(let i =x;i<(page_num*10-c_list_top.length);i++){
                if (i == data.length) {
                    break
                }
                c_table.append(" <tr>"
                + "<td class='col-md-9 text-truncate border-0' style='display: inline-block;'>" + data[i].c_title + "</td>"
                + "<td class='border-0'>" + data[i].c_writer + "</td>"
                + "<td class='border-0'>" + data[i].time + "</td>"
                + "<td class='border-0'>"
                + "<div><button type='button' class='btn btn-dark dropdown-toggle'"
                + "data-toggle='dropdown'>操作</button>"
                + "<div class='dropdown-menu'><a class='dropdown-item  c_del' href='#'>删除</a>"
                + "<a class='dropdown-item c_modify' data-toggle='modal'"
                + "data-target='#modify_text ' href='#'>修改</a>"
                + "<a class='dropdown-item c_top' href='#'>置顶</a>"
                + "</div></div> </td>"
                + "<input type=\"hidden\" name='c_id' value='" + data[i].c_id + "'>"
                + "<input type=\"hidden\" name=\"c_content\" value='" + data[i].c_text + "'>"
                + "</tr>")
            }
        }
        setTimeout(function () {
            c_btn()
        }, 500)
    }
    function alert(msg) {
        let mo = `
        <div class="modal fade show modal_alert"  style="display: block; padding-right: 17px;" aria-modal="true" >
                                <div class="modal-dialog modal-lg" style="">
                                    <div class="modal-content" style="">
                                        <!-- 模态框头部 -->
                                        <div class="modal-header">
                                            <h4 class="modal-title">提示</h4>
                                            <button type="button" class="close" data-dismiss="modal">×</button>
                                        </div>
                                        <!-- 模态框主体 -->
                                        <div class="modal-body" style="">
                                           `+ msg + `
                                            </div>
                                            <!-- 内容栏目结束 -->
                                            <!-- 模态框底部 -->
                                            <div class="modal-footer">
                                                <button class="col-md-3 border bg-light alert_close" style="height: 50px;" data-dismiss="modal">确定</button>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>`
        $('body').append(mo)

        $('.alert_close').click(
            function () {
                $('.modal_alert').removeClass('show').css('display', 'none')
            }
        )
    }
    function getContent_place_top(data, page_num = 1) {
        let c_table = $('#c_table')
        c_table.html("")

        if(c_list_top.length-page_num*10>=0){
            for(let i=(page_num-1)*10;i<=page_num*10-1;i++){

                c_table.append(" <tr>"
                + "<td class='col-md-9 text-truncate border-0' style='display: inline-block;'>" + data[i].c_title + "<input class='text-danger col-md-2 border-0' style='font-size:12px; background:none;' value='(top)' disabled='disabled'></td>"
                + "<td class='border-0'>" + data[i].c_writer + "</td>"
                + "<td class='border-0'>" + data[i].time + "</td>"
                + "<td class='border-0'>"
                + "<div><button type='button' class='btn btn-dark dropdown-toggle'"
                + "data-toggle='dropdown'>操作</button>"
                + "<div class='dropdown-menu'><a class='dropdown-item  c_del' href='#'>删除</a>"
                + "<a class='dropdown-item c_modify' data-toggle='modal'"
                + "data-target='#modify_text ' href='#'>修改</a>"
                + "<a class='dropdown-item c_untop' href='#'>取消置顶</a>"
                + "</div></div> </td>"
                + "<input type=\"hidden\" name='c_id' value='" + data[i].c_id + "'>"
                + "<input type=\"hidden\" name=\"c_content\" value='" + data[i].c_text + "'>"
                + "</tr>")

            }
        }else{
            for(let i=(page_num-1)*10;i<c_list_top.length;i++){
                c_table.append(" <tr>"
                + "<td class='col-md-9 text-truncate border-0' style='display: inline-block;'>" + data[i].c_title + "<input class='text-danger col-md-2 border-0' style='font-size:12px; background:none;' value='(top)' disabled='disabled'></td>"
                + "<td class='border-0'>" + data[i].c_writer + "</td>"
                + "<td class='border-0'>" + data[i].time + "</td>"
                + "<td class='border-0'>"
                + "<div><button type='button' class='btn btn-dark dropdown-toggle'"
                + "data-toggle='dropdown'>操作</button>"
                + "<div class='dropdown-menu'><a class='dropdown-item  c_del' href='#'>删除</a>"
                + "<a class='dropdown-item c_modify' data-toggle='modal'"
                + "data-target='#modify_text ' href='#'>修改</a>"
                + "<a class='dropdown-item c_untop' href='#'>取消置顶</a>"
                + "</div></div> </td>"
                + "<input type=\"hidden\" name='c_id' value='" + data[i].c_id + "'>"
                + "<input type=\"hidden\" name=\"c_content\" value='" + data[i].c_text + "'>"
                + "</tr>")
            }
        }
        setTimeout(function () {
            c_btn()
        }, 500)
    }

    //帖子操作按钮加载
    let c_delFun = undefined;
    let c_modFun = undefined;
    let c_modFun_t = undefined;
    let c_topFun = undefined;
    let c_untopFun = undefined;
    function c_btn() {
        //判断清空监听
        if (c_delFun != undefined || c_modFun != undefined) {
            $('.c_del').unbind('click', c_delFun)
            $('.c_modify').unbind('click', c_modFun)
            c_delFun = undefined
            c_modFun = undefined
            c_topFun = undefined
            c_untopFun = undefined
        }
        //删除帖子
        $('.c_del').bind('click', c_delFun = function () {
            let t_place = $(this).parent().parent().parent().siblings()//本条内容的html
            let c_id = $((t_place)[3]).val()//内容Id
            let c_content = $((t_place)[4]).val()//内容
            let title = $((t_place)[0]).text()//标题
            let writer = $((t_place)[1]).text()//作者
            let time = $((t_place)[2]).text()//时间
            if (confirm("确定要删除吗？")) {
                $.ajax({
                    type: 'GET',
                    url: 'http://localhost:7300/mock/5ee7242cb1a45736b4181f4a/dog/delete?id=' + c_id + '&title=' + title,
                    success: function (msg) {
                        for (i in c_list_w) {
                            if (c_list_w[i].c_id == c_id) {
                                c_list_w.splice(i, 1)
                            }
                        }
                        for (i in c_list_top) {
                            if (c_list_top[i].c_id == c_id) {
                                c_list_top.splice(i, 1)
                            }
                        }
                        getContent_place_top(c_list_top);
                        getContent(c_list_w, 1)
                        // getContent(c_list_w)
                        alert(msg.data.result)
                    }, error: function (error) {
                        console.log(error.responseText);
                    }
                })
            } else {
                return false
            }
        })
        // 置顶帖子
        $('.c_top').bind('click', c_topFun = function () {
            let t_place = $(this).parent().parent().parent().siblings()//本条内容的html
            let c_id = $((t_place)[3]).val()//内容Id
            let c_content = $((t_place)[4]).val()//内容
            let title = $((t_place)[0]).text()//标题
            let writer = $((t_place)[1]).text()//作者
            let time = $((t_place)[2]).text()//时间

            for (i in c_list_w) {
                if (c_list_w[i].c_id == c_id) {
                    c_list_top.unshift(c_list_w[i])
                    // console.log(c_list_top);
                    c_list_w.splice(i, 1)
                    getContent_place_top(c_list_top,1);
                    getContent(c_list_w,1,1)
                }
            }
            // console.log(c_list_top);


            // console.log(c_id);

        })
        // 取消置顶
        $('.c_untop').bind('click', c_untopFun = function () {
            let t_place = $(this).parent().parent().parent().siblings()//本条内容的html
            let c_id = $((t_place)[3]).val()//内容Id
            let c_content = $((t_place)[4]).val()//内容
            let title = $((t_place)[0]).text()//标题
            let writer = $((t_place)[1]).text()//作者
            let time = $((t_place)[2]).text()//时间

            for (i in c_list_top) {
                if (c_list_top[i].c_id == c_id) {

                    // console.log(c_list_top);
                    c_list_w.unshift(c_list_top[i])
                    // console.log(c_list_top[i]);
                    c_list_top.splice(i, 1)
                    getContent_place_top(c_list_top,w_page_num);
                    getContent(c_list_w, 1,w_page_num)
                }
            }
        })
        //修改帖子
        $('.c_modify').bind('click', c_modFun = function () {
            let t_place = $(this).parent().parent().parent().siblings()//本条内容的html
            let c_id = $((t_place)[3]).val()//内容Id
            let c_content = $((t_place)[4]).val()//内容
            let title = $((t_place)[0]).text()//标题
            let writer = $((t_place)[1]).text()//作者
            let time = $((t_place)[2]).text()//时间

            $("#modify_c_title").val(title)
            UE.getEditor('editor_modify').setContent(c_content)
            // 预留处理函数

            setTimeout(function () {
                c_modify_t(c_id, writer, time, title)
            }, 500)
        })
    }
    //修改确认
    function c_modify_t(c_id, writer, time, title) {
        if (c_modFun_t != undefined) {
            $('#modify_true').unbind('click', c_modFun_t)
            c_modFun_t = undefined
        }
        $('#modify_true').bind('click', c_modFun_t = function () {
            $.ajax({
                type: 'GET',
                url: 'http://localhost:7300/mock/5ee7242cb1a45736b4181f4a/dog/modify?id=' + c_id + '&title=' + title,
                success: function (msg) {
                    for (i in c_list_w) {
                        if (c_list_w[i].c_id == c_id) {
                            c_list_w.splice(i, 1, { c_id: c_id, c_title: $("#modify_c_title").val(), c_text: UE.getEditor('editor_modify').getContent(), c_writer: writer, time: time })
                        }
                    }
                    for (i in c_list_top) {
                        if (c_list_top[i].c_id == c_id) {
                            c_list_top.splice(i, 1, { c_id: c_id, c_title: $("#modify_c_title").val(), c_text: UE.getEditor('editor_modify').getContent(), c_writer: writer, time: time })
                        }
                    }

                    getContent_place_top(c_list_top);
                    getContent(c_list_w, 1)
                    alert(msg.data.result)
                }, error: function (error) {
                    console.log(error.responseText);
                }
            })


        })
    }
    //添加内容
    $('#add_content').click(function () {
        if ($('#username').text() == '登录') {
            alert('请登录后再发帖')
        } else {
            $.ajax({
                type: 'GET',
                url: 'http://localhost:7300/mock/5ee7242cb1a45736b4181f4a/dog/adduser?title=' + $("#add_title").val() + "&content=" + UE.getEditor('editor').getContent(),
                success: function (msg) {
                    let n_c_id = parseInt(c_list_w[c_list_w.length - 1].c_id) + 1
                    c_list_w.push({ c_id: n_c_id, c_title: $("#add_title").val(), c_text: UE.getEditor('editor').getContent(), c_writer: $('#username').text(), time: "2020-6-20" })
                    getContent(c_list_w)
                    alert(msg.data.result)
                    $("#add_title").val("")
                    UE.getEditor('editor').setContent("")
                }, error: function (error) {
                    console.log(error.responseText);
                }
            })
        }



    })


})